$(function() {
    $("#menubanner-slider").slidebox({
        boxh: 430, //盒子的高度
        w: 1000, //图片的宽度
        h: 430, //图片的高度
        isShow: true, //是否显示控制器
        isShowBtn: true, //是否显示左右按钮
        controltop: 2, //控制按钮上下偏移的位置,要将按钮向下移动   首先保证boxh 高度>图片 h
        controlsW: 24, //控制按钮宽度
        controlsH: 24, //控制按钮高度
        radius: 12, //控制按钮圆角度数
        controlsColor: "#fff", //普通控制按钮的颜色
        controlsCurrentColor: "#f60" //当前控制按钮的颜色
    });
    $(".control-body-slider-small").slidebox({
        boxh: 218, //盒子的高度
        w: 332, //图片的宽度
        h: 218, //图片的高度
        isShow: true, //是否显示控制器
        isShowBtn: true, //是否显示左右按钮
        controltop: 10, //控制按钮上下偏移的位置,要将按钮向下移动   首先保证boxh 高度>图片 h
        controlsW: 12, //控制按钮宽度
        controlsH: 4, //控制按钮高度
        radius: 0, //控制按钮圆角度数
        controlsColor: "#fff", //普通控制按钮的颜色
        controlsCurrentColor: "#f60" //当前控制按钮的颜色
    });
    $(".control-body-slider").slidebox({
        boxh: 340, //盒子的高度
        w: 425, //图片的宽度
        h: 338, //图片的高度
        isShow: true, //是否显示控制器
        isShowBtn: true, //是否显示左右按钮
        controltop: 10, //控制按钮上下偏移的位置,要将按钮向下移动   首先保证boxh 高度>图片 h
        controlsW: 12, //控制按钮宽度
        controlsH: 4, //控制按钮高度
        radius: 0, //控制按钮圆角度数
        controlsColor: "#fff", //普通控制按钮的颜色
        controlsCurrentColor: "#f60" //当前控制按钮的颜色
    });
    $('.control span').mouseover(function() {
        $(this).closest('.container').find('.horizontal-commodity').eq($(this).index()).addClass('active').siblings('.horizontal-commodity').removeClass('active')
        $(this).addClass('active').siblings().removeClass('active')
    })
    $('.accordion li').on('mouseover', function() {
        $(this).find('h4').hide().next('div').show().closest('li').siblings('li').find('h4').show().next('div').hide()
    })
    $('.radius-btn span').on('click', function() {
        $(this).addClass('active').siblings().removeClass('active').closest('.container').find('.horizontal-commodity').eq($(this).index()).addClass('active').siblings('.horizontal-commodity').removeClass('active')
    })
    $('.back').on('click',function(){
        $('html,body').animate({scrollTop:0},1000)
    })
    // 网页点击跳转
    $('.floor li').on({
        // 触摸改变颜色和长度
        'mouseover':function(){
            let bgcolor = $(this).data('bgcolor')
            $(this).css({
                backgroundPositionX:-40,
                backgroundColor:bgcolor
            })
            $(this).stop().animate({width:80},200)
        },
        'mouseout':function(){
            $(this).stop().animate({width:40},200,function(){
                $(this).css({
                    backgroundPositionX:0,
                    backgroundColor:''
                })
            })
        },
        // 点击改变scrollTop
        'click':function(){
            // 获取索引
            let thisindex = $(this).index()
            // 对应网页里面.floor-box的元素索引找对应的内容距离浏览器高度
            let floorBoxTop =  $('.floor-box').eq(thisindex).offset().top;
            $('html,body').animate({scrollTop:floorBoxTop-50},1000)
        }
    })
    let florli = $('.floor li');
    $(window).on({
        
        // 滚轮滑动
        'scroll':function(){
            // 滚轮滑动大于550的时候就将头部的搜索框给到.search-box
            if($(this).scrollTop()>550){
                $('.search-box').slideDown()
                $('.head-search-body').appendTo('.search-box')
            }else{
                $('.search-box').slideUp()
                $('.head-search-body').appendTo('.head-search')
            }
            var top=$('html,body').scrollTop();
            var ulbox=$('.floor');
            var items=$('.floor-box');
            var currentId='';//当前所在楼层的#id
            items.each(function(){
                var _this=$(this);
                var itemstop=_this.offset().top;//遍历出每个楼层距离顶部的高度
                if(top>itemstop-600){
                    currentId='#'+_this.attr('id');
                }else{
                    return false;
                }
            })
            // console.log(currentId);
        }
    })
})